<template>
  <el-dialog
    title="编辑"
    :visible.sync="visible"
    width="75vw"
    top="8vh"
    :close-on-click-modal="false"
  >
    <div class="boxsty">
      <el-row>
        <el-form
          :model="dataForm"
          ref="dataForm"
          label-width="130px"
        >
          <el-col :span="24">
            <el-col :span="6">
              <el-form-item label="任务书名称:" prop="workAssignName">
                <el-input
                  disabled
                  v-model="dataForm.workAssignName"
                  placeholder="任务书名称"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="任务书有效期:" required>
                <el-col :span="10">
                  <el-form-item prop="workAssignYxqq">
                    <el-date-picker
                      disabled
                      v-model="dataForm.workAssignYxqq"
                      type="date"
                      value-format="yyyy-MM-dd"
                      placeholder="开始日期"
                      style="width: 100%"
                    ></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="4">
                  <div class="text-center">至</div>
                </el-col>
                <el-col :span="10">
                  <el-form-item prop="workAssignYxqz">
                    <el-date-picker
                      disabled
                      v-model="dataForm.workAssignYxqz"
                      type="date"
                      value-format="yyyy-MM-dd"
                      placeholder="结束日期"
                      style="width: 100%"
                    ></el-date-picker>
                  </el-form-item>
                </el-col>
              </el-form-item>
            </el-col>
            <el-col :span="6">
              <el-form-item label="模板名称:" prop="templateId">
                <el-input
                  placeholder="请输入内容"
                  v-model="dataForm.templateName"
                  :disabled="true">
                </el-input>
              </el-form-item>
            </el-col>
          </el-col>
        </el-form>
      </el-row>
      <el-row>
        <el-col :span="24">
          <el-col :span="12">
            <div>
              <div
                style="
                  float: left;
                  width: 118px;
                  margin-right: 12px;
                  text-align: right;
                "
              >
                <el-button type="text" icon="el-icon-user-solid"></el-button>
              </div>
              <div style="float: left">
                <div>被考核人</div>
                <div>
                  <span class="mg-r15">
                    {{ dataForm.ryName }}
                  </span>
                </div>
              </div>
            </div>
          </el-col>
        </el-col>
      </el-row>
    </div>
    <div style="margin:10px 0;text-align: right;">
      <el-button @click="closeBtn">关闭</el-button>
    </div>
    <el-table
      :data="dataList"
      border
      style="width: 100%;"
      min-height="60vh"
      ref="table"
      v-loading="loading"
    >
      <el-table-column
        type="selection"
        width="55"
        header-align="center"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="zhibiaoType"
        label="指标类别"
        min-width="90"
        header-align="center"
        align="center"
      ></el-table-column>
      <el-table-column
        prop="zhibiaoName"
        label="指标名称"
        min-width="120"
        show-overflow-tooltip
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="weight"
        label="权重(%)"
        min-width="110"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="formulaId"
        label="计算公式"
        min-width="180"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <span>
            <span v-for="item in formulaOptions">
              <span v-if="scope.row.formulaId == item.id">{{ item.gsMc }}</span>
            </span>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="targetValue"
        label="目标值"
        min-width="200"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <el-input
            disabled
            type="textarea"
            :rows="3"
            style="white-space: pre-wrap"
            v-model="scope.row.targetValue"
            placeholder="请输入内容"
          />
        </template>
      </el-table-column>
      <el-table-column
        prop="unit"
        label="单位"
        min-width="100"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="targetValueType"
        label="完成值获取方式"
        min-width="180"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <span  v-for="item in typeList">
            <span v-if="scope.row.targetValueType == item.value">{{item.name}}</span>
          </span>
        </template>
      </el-table-column>
      <el-table-column
        prop="khrName"
        label="考核人"
        min-width="180"
        header-align="center"
        align="center"
      >
      </el-table-column>
      <el-table-column
        prop="isziping"
        label="是否自评"
        min-width="120"
        show-overflow-tooltip
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          <el-switch
            disabled
            v-model="scope.row.isziping"
            active-color="#13ce66"
            inactive-color="#CCCCCC"
            active-value="true"
            inactive-value="false"
            active-text="是"
            inactive-text="否"
          >
          </el-switch>
        </template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>

<script>
import { getListByzbndAndNdId } from "@/api/hetongrenwu/book/bookNd";
import { getListByzbnd } from "@/api/hetongrenwu/book/bookcj";
import {
  getFormula,
  getDataProvider,
} from "@/api/hetongrenwu/hetongyeji/hetongzb";
export default {
  components: {
  },
  data() {
    return {
      visible: false,
      dialogVisible: false,
      dataForm: {},
      formulaOptions: [],
      typeList: [
        { name: "手工填报", value: "0" },
        { name: "自动获取", value: "1" },
      ],
      dataList: [],
      providerList: [],
      newRows: [],
      fayuerendataList: [],
      disabled: true,
      fullscreenLoading: false,
      fullscreenLoadingadd: false,
      loading: false,
      sortingPerChooseDialogData: {},
      pages:"",
    };
  },
  watch: {},
  created() {},
  methods: {
    init(row,pages) {
      this.getXiaLa();
      this.visible = true;
      this.dataForm = row;
      this.pages = pages
      this.grtList();
    },
    getXiaLa() {
      getFormula().then((res) => {
        this.formulaOptions = res.data.data;
      });
      getDataProvider().then((res) => {
        if (res.data.data) {
          this.providerList = res.data.data;
        }
      });
    },
    grtList() {
      var params = {
        cjId: this.dataForm.cjId,
        ndId: this.dataForm.id,
      };
      console.log(this.pages)
      this.loading = true;
      if(this.pages == 'wbhz'){
        getListByzbnd({cjId: this.dataForm.id}).then((response) => {
          this.dataList = response.data.data;
          this.resetDataList();
          this.loading = false;
        });
      }else{
        getListByzbndAndNdId(params).then((response) => {
          this.dataList = response.data.data;
          this.resetDataList();
          this.loading = false;
        });
      }
      
    },
    closeBtn() {
      this.visible = false;
      this.dataForm = {};
      this.dataList = [];
      this.$emit("editChildren", "");
    },
    //重组dataList
    resetDataList() {
      this.dataList = this.dataList.map((item) => {
        item.providerList = [];
        item.tgLx = (item.tgLx ? item.tgLx : 1) || "2";
        //tgLx等于1是机构，2是个人
        if (item.tgLx == "2") {
          item.dataProviderIdSelect = item.targetUserId;
          item.dataProviderNameSelect = item.targetUserName;
        } else {
          item.dataProviderIdSelect = item.dataProviderId;
          item.dataProviderNameSelect = item.dataProvider;
        }
        if (item.targetUserId) {
          item.providerList.push({
            val: item.targetUserId,
            label: item.targetUserName,
          });
        }
        if (item.dataProviderId) {
          item.providerList.push({
            val: item.dataProviderId,
            label: item.dataProvider,
          });
        }
        if (item.targetValue) {
          item.targetValue = item.targetValue.replace(/(；|;)/g, ";\n");
        }
        return item;
      });
    },
  },
};
</script>
